import { createRouter, createWebHashHistory } from 'vue-router'
import { staticRouter } from './modules/static.router'
import { dynamicRouter } from './modules/dynamic.router'
import { useAuthStore } from '@/stores/auth'
import { useNprogress } from '@/hooks/useNprogress'
import { LOGIN_URL } from '@/common/constants/global'
import { useRouteMenu } from '@/hooks/useRouteMenu'

const router = createRouter({
  history: createWebHashHistory(),
  routes: [...staticRouter()] // 此处只导入静态路由，动态路由在路由前置守卫中动态添加
})

/**
 * 路由前置守卫
 */
router.beforeEach(async (to, from) => {
  const authStore = useAuthStore()

  // 进度条显示
  useNprogress().start()

  // 动态设置标题
  const title = import.meta.env.VITE_APP_TITLE
  document.title = to.meta.title ? `${to.meta.title} - ${title}` : title

  // 判断是否在访问登录页，若已登录过（有 access_token）则停留在 from，未登录过则正常访问登录页
  if (to.path === LOGIN_URL) {
    if (authStore.access_token) {
      return from
    } else {
      // 注销动态路由
      useRouteMenu().resetRoute()
      return true
    }
  }

  // 静态路由处理
  const staticRouters = staticRouter().map((item) => item.path)
  if (staticRouters.includes(to.path)) {
    // 当前页面若为静态路由，则直接放行
    return true
  }

  // 动态路由处理
  if (authStore.menuFlat.length) {
    // 判断当前页面是否为开放页面
    const findRoute = authStore.menuFlat.find((item) => item.path === to.path)
    if (findRoute?.meta?.isOpen) {
      // 开放页面无需登录，直接放行
      return true
    } else {
      // 非开放页面，判断是否有 access_token，没有则重定向到 login 页面
      if (!authStore.access_token) {
        return { path: LOGIN_URL, replace: true }
      }
    }
  } else {
    // 重新构建动态路由
    try {
      await dynamicRouter()
      // 构建动态路由后放行
      return { ...to, replace: true }
    } catch (error) {
      // 捕获异常并跳转403页面
      return { name: '403' }
    }
  }
})

/**
 * 路由后置钩子
 */
router.afterEach(() => {
  // 进度条隐藏
  useNprogress().done()
})

/**
 * 路由跳转错误
 */
router.onError((error) => {
  useNprogress().done()
  console.warn('路由错误', error.message)
})

export default router
